package com.example.wjl_ui

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.draw.shadow
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.font.FontFamily
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            // 复古风格主题配置
            MaterialTheme(
                colorScheme = MaterialTheme.colorScheme.copy(
                    primary = Color(0xFF8B4513),    // 深棕色（复古木色）
                    secondary = Color(0xFFD2B48C),  // 浅棕色（桃木色）
                    background = Color(0xFFF5F1E9), // 米黄色（宣纸底色）
                    surface = Color(0xFFFFFBF5),    // 浅米色（卡片底色）
                    onBackground = Color(0xFF5D4037) // 深棕褐色（文字色）
                )
            ) {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    ArtworkGalleryScreen()
                }
            }
        }
    }
}

// 艺术品数据模型
data class Artwork(
    val id: Int,
    val imageRes: Int,
    val title: String,
    val artist: String,
    val year: String
)

// 示例数据 - 请替换为你的实际图片资源
val artworkList = listOf(
    Artwork(
        id = 1,
        imageRes = R.drawable.ink_stain,
        title = "Starry Night",
        artist = "Vincent van Gogh",
        year = "1889"
    ),
    Artwork(
        id = 2,
        imageRes = R.drawable.scroll_top,
        title = "Mona Lisa",
        artist = "Leonardo da Vinci",
        year = "1503-1519"
    ),
    Artwork(
        id = 3,
        imageRes = R.drawable.scroll_bottom,
        title = "The Scream",
        artist = "Edvard Munch",
        year = "1893"
    )
)

@Composable
fun ArtworkGalleryScreen() {
    var currentIndex by remember { mutableStateOf(0) }
    val totalItems = artworkList.size
    val currentArtwork = artworkList[currentIndex]

    // 复古纹理背景（模拟画布质感）
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(
                brush = Brush.verticalGradient(
                    colors = listOf(
                        Color(0xFFF5F1E9),
                        Color(0xFFE8E0D0)
                    )
                )
            )
            .padding(16.dp)
    ) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .padding(8.dp),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.SpaceBetween
        ) {
            // 顶部复古标题栏
            Column(horizontalAlignment = Alignment.CenterHorizontally) {
                Text(
                    text = "VINTAGE ART GALLERY",
                    fontSize = 28.sp,
                    fontWeight = FontWeight.Bold,
                    color = MaterialTheme.colorScheme.primary,
                    fontFamily = FontFamily.Serif, // 衬线字体增强复古感
                    letterSpacing = 2.sp
                )
                // 标题下方复古装饰线
                Box(
                    modifier = Modifier
                        .width(120.dp)
                        .height(2.dp)
                        .background(
                            brush = Brush.horizontalGradient(
                                colors = listOf(
                                    Color.Transparent,
                                    MaterialTheme.colorScheme.secondary,
                                    Color.Transparent
                                )
                            )
                        )
                        .padding(top = 8.dp)
                )
            }

            // 主要内容区（带画框效果）
            Column(
                modifier = Modifier.fillMaxWidth(),
                horizontalAlignment = Alignment.CenterHorizontally,
                verticalArrangement = Arrangement.Center
            ) {
                // 复古画框效果（多层边框+阴影）
                Box(
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(380.dp)
                        .padding(12.dp)
                        // 外层深色木框
                        .background(MaterialTheme.colorScheme.primary.copy(alpha = 0.8f))
                        .padding(4.dp)
                        // 中层浅色木框
                        .background(MaterialTheme.colorScheme.secondary.copy(alpha = 0.9f))
                        .padding(8.dp)
                        // 内层画布底色
                        .background(MaterialTheme.colorScheme.surface)
                        .shadow(
                            elevation = 10.dp,
                            shape = RoundedCornerShape(2.dp),
                            ambientColor = Color(0x33000000),
                            spotColor = Color(0x44000000)
                        )
                ) {
                    // 艺术品图片
                    Image(
                        painter = painterResource(id = currentArtwork.imageRes),
                        contentDescription = "${currentArtwork.title} by ${currentArtwork.artist}",
                        modifier = Modifier
                            .fillMaxSize()
                            .padding(8.dp),
                        contentScale = ContentScale.Fit
                    )
                }

                Spacer(modifier = Modifier.height(40.dp))

                // 艺术品信息卡片（复古标签风格）
                Box(
                    modifier = Modifier
                        .fillMaxWidth(0.8f)
                        .background(
                            color = MaterialTheme.colorScheme.surface,
                            shape = RoundedCornerShape(4.dp)
                        )
                        .border(
                            width = 1.dp,
                            color = MaterialTheme.colorScheme.secondary.copy(alpha = 0.6f),
                            shape = RoundedCornerShape(4.dp)
                        )
                        .padding(16.dp)
                ) {
                    Column(horizontalAlignment = Alignment.CenterHorizontally) {
                        Text(
                            text = currentArtwork.title,
                            fontSize = 24.sp,
                            fontWeight = FontWeight.SemiBold,
                            color = MaterialTheme.colorScheme.onBackground,
                            fontFamily = FontFamily.Serif,
                            letterSpacing = 1.sp
                        )
                        Spacer(modifier = Modifier.height(12.dp))
                        Text(
                            text = "by ${currentArtwork.artist}",
                            fontSize = 18.sp,
                            color = MaterialTheme.colorScheme.onBackground.copy(alpha = 0.8f),
                            fontFamily = FontFamily.Serif
                        )
                        Spacer(modifier = Modifier.height(4.dp))
                        // 修复：显示实际年份（之前写死为 "year"）
                        Text(
                            text = "Created in ${currentArtwork.year}",
                            fontSize = 16.sp,
                            color = MaterialTheme.colorScheme.primary.copy(alpha = 0.7f),
                            fontFamily = FontFamily.Serif
                        )
                    }
                }
            }

            // 底部复古风格按钮
            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(vertical = 16.dp),
                horizontalArrangement = Arrangement.Center,
                verticalAlignment = Alignment.CenterVertically
            ) {
                // 上一个按钮（复古木质风格）
                VintageButton(
                    text = "Previous",
                    onClick = {
                        currentIndex = (currentIndex - 1 + totalItems) % totalItems
                    }
                )

                Spacer(modifier = Modifier.width(32.dp))

                // 下一个按钮
                VintageButton(
                    text = "Next",
                    onClick = {
                        currentIndex = (currentIndex + 1) % totalItems
                    }
                )
            }
        }
    }
}

// 复古风格按钮组件（修复按钮边框问题）
@Composable
fun VintageButton(text: String, onClick: () -> Unit) {
    Button(
        onClick = onClick,
        modifier = Modifier
            .size(150.dp, 58.dp)
            .shadow(
                elevation = 4.dp,
                shape = RoundedCornerShape(4.dp),
                ambientColor = Color(0x22000000)
            ),
        shape = RoundedCornerShape(4.dp),
        colors = ButtonDefaults.buttonColors(
            containerColor = MaterialTheme.colorScheme.secondary.copy(alpha = 0.9f),
            disabledContainerColor = MaterialTheme.colorScheme.secondary.copy(alpha = 0.5f)
        ),
        // 修复：直接使用 BorderStroke，移除未实现的扩展函数
        border = BorderStroke(
            width = 1.dp,
            color = MaterialTheme.colorScheme.primary.copy(alpha = 0.6f)
        )
    ) {
        Text(
            text = text.uppercase(),
            fontSize = 16.sp,
            color = MaterialTheme.colorScheme.primary,
            fontWeight = FontWeight.Medium,
            fontFamily = FontFamily.Serif,
            letterSpacing = 1.sp
        )
    }
}

@Preview(showBackground = true, widthDp = 360, heightDp = 640)
@Composable
fun ArtworkGalleryPreview() {
    MaterialTheme(
        colorScheme = MaterialTheme.colorScheme.copy(
            primary = Color(0xFF8B4513),
            secondary = Color(0xFFD2B48C),
            background = Color(0xFFF5F1E9),
            surface = Color(0xFFFFFBF5),
            onBackground = Color(0xFF5D4037)
        )
    ) {
        Surface(
            modifier = Modifier.fillMaxSize(),
            color = MaterialTheme.colorScheme.background
        ) {
            ArtworkGalleryScreen()
        }
    }
}